<script src="/js/jquery.validate.js" type="text/javascript"></script>
<script src="/js/academico/changepass/changepass.js" type="text/javascript"></script>
<style type="text/css">
    .input-group-addon
    {
        background-color: rgb(50, 118, 177);
        border-color: rgb(40, 94, 142);
        color: rgb(255, 255, 255);
    }
    .form-control:focus
    {
        background-color: rgb(50, 118, 177);
        border-color: rgb(40, 94, 142);
        color: rgb(255, 255, 255);
    }

    .form-signup input[type="text"],.form-signup input[type="password"] { border: 1px solid rgb(50, 118, 177); }
</style>
<div class="text-center">
    <h2>Cambiar Contrase&ntilde;a</h2>
</div>
<br />
<div class="row">
    <div class="col-md-1"></div>
    <div class="col-md-5">
        <div class="panel panel-default">
            <div class="panel-body">
                <form id="form-pass" class="form form-signup" role="form">
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
                            <input id="username" name="username" type="text" class="form-control" placeholder="Nombre de Usuario" value="<?php echo $this->username; ?>" disabled >
                        </div> 
                    </div>                        
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                            <input id="password" name="password" type="password" class="form-control" placeholder="Contrase&ntilde;a anterior" />
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">
                            <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                            <input id="password_new" name="password_new" type="password" class="form-control" placeholder="Contrase&ntilde;a nueva" />
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="input-group">                            
                            <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
                            <input id="password_new2" name="password_new2" type="password" class="form-control" placeholder="Repetir contrase&ntilde;a nueva" />                                
                        </div>
                    </div>
            </div>            

            <a id="btncambiar" href="#" class="btn btn-sm btn-primary btn-block" role="button" onclick="cambiarPassClick();">Cambiar contrase&ntilde;a</a>             
            </form>
            <div id="div-alert"></div>
        </div>
    </div>
</div>